<template>
	<!-- 巡检计划整改点位(列表) -->
	<view class="check-assets">
		<uni-card title="2022日常安全巡检">
			<template v-slot:title>
				<view class="card-title">
					<view>
						<text>{{lastData.inspPlanName}}</text>
					</view>
					<text class="right-txt color1">{{lastData.inspRecordStatusCn}}</text>
					<!-- <text class="right-txt color2">已结束</text> -->
				</view>
			</template>
			<uni-list :border="false">
				<uni-list-item>
					<template v-slot:body>
						<view class="slot-box" style="width: 100%;">
							<view>
								<uni-icons type="shop-filled" size="18" color="#198a6c"></uni-icons>
								<text>{{lastData.storeName}}</text>
							</view>
							<view class="check-name">
								<uni-icons type="calendar" size="14"></uni-icons>
								{{lastData.inspPlanStartTime?lastData.inspPlanStartTime.replace(/T/,' '):'--'}} 至
								{{lastData.inspPlanEndTime?lastData.inspPlanEndTime.replace(/T/,' '):'--'}}
							</view>
							<view class="check-name">
								<uni-icons type="compose" size="14"></uni-icons>{{lastData.inspPlanRemarks||'--'}}
							</view>
							<view class="check-name">
								计划巡检时间：{{lastData.addTime?lastData.addTime.replace(/T/,' '):'--'}}
							</view>
							<view style="display: flex;justify-content: space-between;">
								<text>总巡检项：{{lastData.inspItemQty+""}}</text>
								<text>合格项：{{lastData.inspItemOkQty+""}}</text>
								<view>
									不合格项：<text style="color: #f00;">{{lastData.inspItemNgQty+""}}</text>
								</view>
							</view>
						</view>
					</template>
				</uni-list-item>
			</uni-list>
		</uni-card>

		<view class="content">
			<uni-card v-for="(item,index) in planList" :key="index" @click="toScanCode(item)">
				<uni-list :border="false">
					<uni-list-item :title="'巡检点位:'+item.inspPositionName" showArrow>
						<template v-slot:header>
							<view class="slot-box">
								<uni-icons type="location-filled" size="18" color="#198a6c"></uni-icons>
							</view>
						</template>
					</uni-list-item>
					<uni-list-item :border="false">
						<template v-slot:body>
							<view class="slot-box" style="width: 100%;">
								<view style="display: flex;justify-content: space-between;">
									<text class="slot-text">总巡检项：{{item.inspItemNums}}</text>
									<text class="slot-text">合格项：{{item.inspOkItemNums}}</text>
									<view>
										不合格项：<text class="slot-text" style="color: #f00;">{{item.inspNgItemNums}}</text>
									</view>
								</view>
							</view>
						</template>
					</uni-list-item>
				</uni-list>
			</uni-card>

			<view :class="{'bottom-btn':true,'permission-none':isPermission('INSP_RECORD_REPORT')}" v-if="showType!='see'">
				<button class="start-button" @click="toSubmitBtn">结束巡检</button>
			</view>
		</view>
		<!-- 对话提示框 -->
		<MessageTip ref="messageTip" :tipContent="'确定提交巡检吗？'" @clickType="handleShowOrHideTip"/>
	</view>
</template>

<script lang="ts" setup>
	import {
		ref
	} from "vue";
	import {
		onPullDownRefresh,
		onReachBottom,
		onLoad,
		onShow,
		onBackPress
	} from "@dcloudio/uni-app";
	import {
		CONSTANT
	} from '@/common/config/config.ts'
	import {
		fromSearch
	} from '@/common/util/tabSearchUse.ts';
	import {
		planInfo,
		report,
		getMainInfo,
		getPoss
	} from '@/common/api/inspectionAPI.ts';
	import {
		isPermission
	} from '@/common/util/common.ts'


	const lastData = ref({})
	const planList = ref([])
	const inspRecordId = ref()
	const showType = ref('')
	const paramsUrl = ref({})
	const messageTip = ref()
	
	// onBackPress((e)=>{
	// 	let obj = uni.getStorageSync('inspectDetailParams')
	// 	uni.navigateTo({
	// 		url:`/pages/ipqc/inspectDetail/index?rowData=${JSON.stringify(obj)}`
	// 	})
	// 	// uni.removeStorageSync('inspectDetailParams');
	// 	return true
	// })

	onShow(() => {
		if (inspRecordId.value) {
			getMainInfo(inspRecordId.value).then(value => {
				if (value.code == 0) {
					lastData.value = value.data
				} else {
					uni.showToast({
						icon: "none",
						title: value.message
					})
				}
			})
			getPlanInfo(inspRecordId.value)
		}
	})

	onLoad((par) => {
		paramsUrl.value = par
		if (par.showType) {
			showType.value = par.showType
		}
		if (par.inspRecordId) {
			inspRecordId.value = par.inspRecordId
			if (!isPermission('INSP_RECORD_DTL_QUERY')) {
				getMainInfo(par.inspRecordId).then(value => {
					if (value.code == 0) {
						lastData.value = value.data
					} else {
						uni.showToast({
							icon: "none",
							title: value.message
						})
					}
				})
			}

		} else {
			uni.showToast({
				icon: "none",
				title: 'inspRecordId有误！'
			})
		}
		getPlanInfo(par.inspRecordId)
	})

	const toScanCode = (item) => {
		if(showType.value=='see'){
			uni.navigateTo({
				url: `/pages/ipqc/submitInspect/index?inspRecordId=${inspRecordId.value}&inspPositionId=${item.inspPositionId}&version=${item.version}&showType=${showType.value}`,
			})
		}else{
			let obj={
				inspPositionNo:item.inspPositionNo,
				inspRecordId:inspRecordId.value,
				inspPositionId:item.inspPositionId,
				version:item.version,
				showType:showType.value
			}
			uni.navigateTo({
				url: `/pages/qrCode/qrCode?tip=直接进入巡检点位列表&successUrl=/pages/ipqc/submitInspect/index&clickTipUrl=/pages/ipqc/submitInspect/index?obj=${JSON.stringify(obj)}`,
			})
			// uni.redirectTo({
			// 	url: `/pages/qrCode/qrCode?tip=直接进入巡检点位列表&successUrl=/pages/ipqc/submitInspect/index&clickTipUrl=/pages/ipqc/submitInspect/index?obj=${JSON.stringify(obj)}`,
			// })
		}
		
		
	}

	// 获取详情
	const getPlanInfo = (inspRecordId) => {
		if (!isPermission('INSP_RECORD_DTL_QUERY')) {
			getPoss(inspRecordId).then(value => {
				uni.stopPullDownRefresh(); //关闭下拉
				planList.value = value.data
			})
		}
	}
	const handleShowOrHideTip = (type:string)=>{
			if(type=='yes'){
				toSubmit() //弹窗点击确定时执行的代码
			}
		}
	// 提交
	const toSubmitBtn = ()=>{
		messageTip.value.openTip()
	}
	const toSubmit = () => {
		if (!isPermission('INSP_RECORD_REPORT')) {
			report({
				inspRecordId: lastData.value.inspRecordId,
				version: lastData.value.version
			}).then(value => {
				if (value.code == 0) {
					uni.showToast({
						title: value.message,
						icon: 'none',
						duration:500
					})
					setTimeout(() => {
						uni.hideToast()
						uni.setStorage({
							key: 'inspectDetail',
							data: 'true'
						})
						let obj = uni.getStorageSync('inspectDetailParams')
						
						uni.redirectTo({
							url:`/pages/ipqc/inspectDetail/index?rowData=${JSON.stringify(obj)}`
						})
						// uni.navigateBack({
						// 	delta: 1
						// })
					}, 500)
				} else {
					uni.showToast({
						title: value.message,
						icon: 'none'
					})
				}
			})
		}


	}

	onPullDownRefresh(() => {
		getPlanInfo(lastData.value.inspRecordId)
	});

	onReachBottom(() => {})
</script>

<style scoped lang="scss">
	uni-page-body {
		height: 100%;
	}

	.check-assets {
	
		// background-color: #f4f4f4;
		overflow-y: scroll;
		.segmented-control {
			background-color: #fff;
		}
	}

	.content {
		height: 58vh;
		overflow-y: scroll;
		:deep(.uni-list-item__container) {
			padding: 5px 20rpx !important;
		}
		:deep(.uni-card){
			margin-top: 0 !important;
		}
	}

	.card-title {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10px;
		border-bottom: 1px solid #ebeef5;
		position: relative;

		.right-txt {
			font-size: 12px;
			color: #fff;
			padding: 5rpx 20rpx;
			box-sizing: border-box;
			border-radius: 18rpx 0 0 18rpx;
			position: absolute;
			right: -20rpx;
		}

		.color1 {
			background-color: #7098ed;
		}

		.color2 {
			background-color: #999999;
		}
	}

	.uni-list-item {
		font-size: 14px !important;

		.check-time {
			color: #fda659;
		}
	}

	.check-name {
		font-size: 12px;
	}

	.footer-btn {
		display: flex;
	}

	.list-btn {
		background-color: #198a6c;
		color: #fff;
		line-height: 2;
		font-size: 14px;
		margin-left: 10rpx;
	}

	.top-text {
		color: #fd8f1a;
	}

	.start-button {
		width: 60%;
		box-sizing: border-box;
		background-color: #fe8f1b;
		line-height: 2;
		color: #fff;
	}

	.change-point {
		border-color: #fe8f1b;
		color: #fe8f1b;
		height: 50rpx;
		line-height: 50rpx;
		box-sizing: border-box;
		font-size: 14px;
		padding: 0rpx 50rpx;
		border-radius: 25rpx;
	}
</style>
